<template>
  <div class="page-profile">
    <div class="page-position">
      <!-- 考试信息 -->
      <div class="mess">
        <Row>
          <i-col span="1">
            <div class="mark"></div>
          </i-col>
          <i-col span="23">
            <p>{{ $t("locale.pc.mytest.profile.t1") }}</p>
          </i-col>
        </Row>
        <div class="contentpos">
          <p class="subject">{{ paper_obj.name }}</p>
          <p class="course">
            {{ $t("locale.pc.mytest.profile.t2") }}:《{{
              course_obj.courseName
            }}》 {{ $t("locale.pc.mytest.profile.t3") }}:{{
              paper_obj.majorName
            }}
          </p>
          <p class="time">
            {{ $t("locale.pc.mytest.profile.t4") }}：{{ paper_obj.remind }}
            <!-- 限时:{{ course_obj.span }}分钟&nbsp; &nbsp; 题量:{{
              paper_obj.items.length
            }}&nbsp; &nbsp; &nbsp; 满分:{{ paper_obj.total }} (及格
            {{ paper_obj.passScore }}分 ) -->
          </p>
          <!-- <p class="validity">
            有效期:{{ lists.validitystar }}至{{ lists.validitystop }}
          </p> -->
          <p class="profile">
            {{ $t("locale.pc.mytest.profile.t5") }}:{{ paper_obj.introduce }}
          </p>
        </div>
      </div>
      <!-- 考试概览 -->
      <div class="overview">
        <!-- <Row>
          <i-col span="1">
            <div class="mark"></div>
          </i-col>
          <i-col span="23">
            <p>考试预览</p>
          </i-col>
        </Row>
        <div class="tops">
          {{ lists.tops }}&nbsp;(共{{ lists.number }}道，每题{{
            lists.score
          }}分，总分{{ lists.total_score }}分)
        </div> -->
        <p>
          <i-button
            @click="
              $router.push(
                '/test_review?type=2&paper_id=' +
                  paper_id +
                  '&id=' +
                  paper_obj.courseId
              )
            "
            >{{ $t("locale.pc.mytest.profile.t6") }}</i-button
          >
        </p>
      </div>
    </div>
  </div>
</template>

<script>
import { mapState, mapActions, mapMutations } from "vuex";
import { getCourse } from "~/api/course";
import { getTestPaper } from "~/api/test";
export default {
  data() {
    return {
      course_obj: {}, //课程
      paper_obj: {
        items: []
      } //试卷
    };
    // 阿拉伯数字转中文数字
    function NoToChinese(num) {
      if (!/^\d*(\.\d*)?$/.test(num)) {
        alert("Number is wrong!");
        return "Number is wrong!";
      }
      var AA = new Array(
        "零",
        "一",
        "二",
        "三",
        "四",
        "五",
        "六",
        "七",
        "八",
        "九"
      );
      var BB = new Array("", "十", "百", "千", "万", "亿", "点", "");
      var a = ("" + num).replace(/(^0*)/g, "").split("."),
        k = 0,
        re = "";
      for (var i = a[0].length - 1; i >= 0; i--) {
        switch (k) {
          case 0:
            re = BB[7] + re;
            break;
          case 4:
            if (
              !new RegExp("0{4}\\d{" + (a[0].length - i - 1) + "}$").test(a[0])
            )
              re = BB[4] + re;
            break;
          case 8:
            re = BB[5] + re;
            BB[7] = BB[5];
            k = 0;
            break;
        }
        if (k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0)
          re = AA[0] + re;
        if (a[0].charAt(i) != 0) re = AA[a[0].charAt(i)] + BB[k % 4] + re;
        k++;
      }
      if (a.length > 1) {
        //加上小数部分(如果有小数部分)
        re += BB[6];
        for (var i = 0; i < a[1].length; i++) re += AA[a[1].charAt(i)];
      }
      return re;
    }
  },
  computed: {
    paper_id() {
      return this.$route.query.id;
    }
  },
  methods: {
    ...mapActions(["initMajorList", "initBuyCourseRecord", "initBuyRecord"]),
    ...mapMutations(["SET_IS_LOADING"]),
    async getTestPaper() {
      let params = {
        id: this.paper_id
      };
      let result = await getTestPaper(params);
      if (result && result.data && result.data.code == 200) {
        this.paper_obj = result.data.data;
        this.getCourse();
      } else {
        this.$Message.error(
          this.$t("locale.pc.mytest.profile.t7") + result.data.msg
        );
      }
    },
    async getCourse() {
      return new Promise(async (res, rej) => {
        this.SET_IS_LOADING(true);
        let result = await getCourse({
          id: this.paper_obj.courseId
        });
        if (result && result.data && result.data.code == 200) {
          const { data } = result.data;
          if (data && data.rows && data.rows.length > 0) {
            this.course_obj = data.rows[0];
          }
        } else {
          this.$Message.error(
            this.$t("locale.pc.mytest.profile.t8") + result.data.msg
          );
        }
        this.SET_IS_LOADING(false);
        res();
      }).then();
    }
  },
  created() {
    this.getTestPaper();
  }
};
</script>

<style lang="scss">
.page-profile {
  width: 100%;
  height: 100%;
  .page-position {
    width: 696px;
    height: auto;
    background: url("/img/shijuan.jpg");
    box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.5);
    margin: 10px auto;
    .mess {
      padding: 21px 21px 21px 21px;
      .contentpos {
        width: 500px;
        margin: 0 auto;
        > p {
          padding: 10px 0px;
        }
        .subject {
          font-family: SourceHanSansSC;
          font-weight: 700;
          font-size: 22px;
          color: rgb(16, 16, 16);
          font-style: normal;
          letter-spacing: 2px;
          line-height: 33px;
          text-decoration: none;
          text-align: center;
        }
        .course {
          font-family: SourceHanSansSC;
          font-weight: 400;
          font-size: 16px;
          color: rgb(16, 16, 16);
          font-style: normal;
          letter-spacing: 0px;
          line-height: 26px;
          text-decoration: none;
          text-align: center;
        }
        .time {
          font-family: SourceHanSansSC;
          font-weight: 400;
          font-size: 16px;
          color: rgb(16, 16, 16);
          font-style: normal;
          letter-spacing: 0px;
          line-height: 24px;
          text-decoration: none;
          text-align: center;
        }
        .validity {
          font-family: SourceHanSansSC;
          font-weight: 400;
          font-size: 16px;
          color: rgb(0, 0, 0);
          font-style: normal;
          letter-spacing: 0px;
          line-height: 24px;
          text-decoration: none;
          text-align: center;
        }
        .profile {
          font-family: SourceHanSansSC;
          font-weight: 400;
          font-size: 14px;
          color: rgb(16, 16, 16);
          font-style: normal;
          letter-spacing: 0px;
          line-height: 20px;
          text-decoration: none;
          text-align: left;
        }
      }
      .ivu-row {
        padding-bottom: 20px;
        .ivu-col {
          .mark {
            width: 10px;
            height: 32px;
            background-color: rgb(91, 150, 255);
            border: none;
            float: left;
          }
          > p {
            font-family: SourceHanSansSC;
            font-weight: 700;
            font-size: 22px;
            color: rgb(16, 16, 16);
            font-style: normal;
            letter-spacing: 0px;
            line-height: 33px;
            text-decoration: none;
          }
        }
      }
    }
    .overview {
      .ivu-row {
        padding: 21px 21px 21px 21px;
        .ivu-col {
          .mark {
            width: 10px;
            height: 32px;
            background-color: rgb(91, 150, 255);
            border: none;
            float: left;
          }
          > p {
            font-family: SourceHanSansSC;
            font-weight: 700;
            font-size: 22px;
            color: rgb(16, 16, 16);
            font-style: normal;
            letter-spacing: 0px;
            line-height: 33px;
            text-decoration: none;
          }
        }
      }
      .tops {
        width: 100%;
        height: 60px;
        font-family: SourceHanSansSC;
        font-weight: 700;
        font-size: 16px;
        color: rgb(16, 16, 16);
        font-style: normal;
        letter-spacing: 0px;
        line-height: 60px;
        text-decoration: none;
        text-align: left;
        padding: 0px 100px;
        box-shadow: rgba(0, 0, 0, 0.25) 0px 1px 3px 0px;
      }
      > p {
        width: 100%;
        text-align: center;
        padding: 26px 0px 27px 0px;
        .ivu-btn {
          width: 243px;
          height: 47px;
          background-color: rgb(91, 150, 255);
          border: none;
          color: rgb(255, 255, 255);
          border-radius: 4px;
          font-size: 16px;
          text-align: center;
          font-weight: bold;
          font-style: normal;
        }
      }
    }
  }
}
</style>
